<section class="user-content">
  <h1>{{this.model.name}}</h1>
  <p>{{this.model.description}}</p>

  <form class="query-run" {{on "submit" this.run}}>
    {{#if this.hasParams}}
      <ParamInputForm
        @initialValues={{this.parsedParams}}
        @paramInfo={{this.model.param_info}}
        @onRegisterApi={{this.onRegisterApi}}
      />
    {{/if}}

    <DButton
      @action={{this.run}}
      @icon="play"
      @label="explorer.run"
      @type="submit"
      class="btn-primary"
    />

    <DButton
      @action={{this.toggleBookmark}}
      @label={{this.bookmarkLabel}}
      @icon={{this.bookmarkIcon}}
      class={{this.bookmarkClassName}}
    />
  </form>

  <ConditionalLoadingSpinner @condition={{this.loading}} />

  {{#if this.results}}
    <div class="query-results">
      {{#if this.showResults}}
        <QueryResult
          @query={{this.model}}
          @content={{this.results}}
          @group={{this.group}}
        />
      {{else}}
        {{#each this.results.errors as |err|}}
          <pre class="query-error"><code>{{~err}}</code></pre>
        {{/each}}
      {{/if}}
    </div>
  {{/if}}
</section>